<template>
    <div class="myeach">
      <div class="nav"><Nav></Nav></div>
    <div class="center">  
      <leftall class="left"></leftall>
      <centerall class="center"></centerall>
      <rigthall class="rigth"></rigthall>
    </div>
  </div>
  </template>
    
  <script>
  import Nav from "../../components/nav.vue"
  import leftall from "../../components/leftall.vue"
  import centerall from "../../components/centerall.vue"
  import rigthall from "../../components/rigthall.vue"

  export default {
    name: "HelloWorld",
    components: {
      leftall,
      Nav,
      centerall,
      rigthall
    }
  };
  </script>
    
  <style lang="scss" scoped>
  .myeach{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: url(../../assets/pageBg.png);
    // background-color: #030c13;
    background-size: 100% 100%;
    flex-direction: corgba(27, 54, 58, 0.8)
   
  }
  .nav{
    flex: 1;
  }
  .center{
    flex: 1;
    display: flex;
    height: 100%;
    width: 100%;
  }
  .left{
    flex: 1;
  }
  .center{
    flex: 8;
  }
  .rigth{
    flex: 12;
  }
  </style>
    